@import './variables.scss';
@import './mixin.scss';
@import './transition.scss';
@import './element-ui.scss';
@import './sidebar.scss';
@import './btn.scss';

body {
  height: 100%;
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  font-family: Helvetica Neue, Helvetica, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Arial, sans-serif;
}

label {
  font-weight: 700;
}

html {
  height: 100%;
  box-sizing: border-box;
}

#app {
  height: 100%;
}

*,
*:before,
*:after {
  box-sizing: inherit;
}

.no-padding {
  padding: 0px !important;
}

.padding-content {
  padding: 4px 0;
}

a:focus,
a:active {
  outline: none;
}

a,
a:focus,
a:hover {
  cursor: pointer;
  color: inherit;
  text-decoration: none;
}

div:focus {
  outline: none;
}

.fr {
  float: right;
}

.fl {
  float: left;
}

.pr-5 {
  padding-right: 5px;
}

.pl-5 {
  padding-left: 5px;
}

.block {
  display: block;
}

.pointer {
  cursor: pointer;
}

.inlineBlock {
  display: block;
}

.clearfix {
  &:after {
    visibility: hidden;
    display: block;
    font-size: 0;
    content: " ";
    clear: both;
    height: 0;
  }
}

.carouselbox{position: relative; }
.indextop{ z-index: 10; position: fixed; top:0; left:0; width: 100%; height: 50px; background-color:rgba($color: #000000, $alpha: 0.5) }
.indextop .tbox{width: 1200px; margin: 0 auto;}
.indextop .tbox .indexlogo{ float: left; padding: 10px 0 10px 53px; line-height: 30px; font-size: 22px; color:#fff; background:url('../assets/image/logo.png') left center no-repeat;}
.indextop .tbox .nav{float:right;}
.indextop .tbox .nav .search{ position: relative; float: left; width: 180px; height: 30px; margin:10px 20px 0 0; padding:0 30px 0 15px; border:#fff solid 1px; border-radius: 30px;}
.indextop .tbox .nav .search::after{ content:""; position: absolute; top:0; right:10px; width: 20px; height:28px; background:url(../assets/image/icotop_search.png) center no-repeat;}
.indextop .tbox .nav .navbox{ position: relative; float: left; margin:10px 20px; line-height: 30px; font-size: 14px; color:#fff; cursor: pointer;}
.indextop .tbox .nav .navbox.name{padding-left: 30px; background:url(../assets/image/icotop_name.png) left center no-repeat}
.indextop .tbox .nav .navbox.tz{padding-left: 30px; background:url(../assets/image/icotop_wdtz.png) left center no-repeat}
.indextop .tbox .nav .navbox.fk{padding-left: 30px; background:url(../assets/image/icotop_fkjy.png) left center no-repeat}
.indextop .tbox .nav .navbox.mess{ padding-left: 30px; background:url(../assets/image/icotop_xx.png) left center no-repeat}
.indextop .tbox .nav .navbox.logout{padding-left: 30px; background:url(../assets/image/icotop_tc.png) left center no-repeat}
.indextop .tbox .nav .navbox .num{ position: absolute; top:0; right:-10px; min-width: 10px; height:16px; padding:0 5px; line-height: 16px; text-align: center; font-size: 12px; color:#fff; background-color:#ff0000; border-radius: 10px;}
.carouselbox .carousel{height: 360px; background:#07073b }
.carouselbox .carousel >>> .el-carousel .el-carousel__container{height: 360px; }
.carouselbox .carousel >>> li.el-carousel__indicator .el-carousel__button{ width: 8px; height:8px; border-radius: 8px;  background-color:#a5a2c1; opacity: 1;}
.carouselbox .carousel >>> li.el-carousel__indicator.is-active .el-carousel__button{ width: 26px; height:8px; border-radius: 8px; background-color:#4b7dba}
.carouselimg{position: relative; z-index: 1; height: 360px; background-position: center; background-repeat: no-repeat;}
.carouselcon{width: 1200px; margin: 0 auto; padding:90px 0 0 650px; color:#fff; text-align: center;}
.carouselcon h2{ margin:0; font-size: 46px; font-weight: bold; }
.carouselcon .p{ margin:0; padding-top:20px; line-height: 30px; font-size: 18px; }
.carouselcon .more{ display: inline-block; margin:20px 0 0; width: 180px; height: 50px; line-height: 50px; font-size: 16px; color:#fff; background-color: #5698d2; border-radius: 25px; cursor: pointer; }
.carouselcon.l{ padding:90px 650px 0 0;}

.menuconbox{ padding:116px 0 100px;}
.menubox{ width: 1200px; margin: 0 auto; text-align: left;}
.menubox .menu{ position: relative; display: inline-block; width: calc(20% - 20px); min-height: 220px; padding-left:68px; padding-bottom:40px; margin-right: 25px; margin-bottom:30px; text-align: left;vertical-align:top}
.menubox .menu:last-child{ margin-right: 0;}
.menubox.flex{ text-align: center;}
.menubox .menu h2{ width: 100%; overflow: hidden; margin:0; line-height: 48px; font-size: 20px; font-weight: normal;}
.menubox .menu .icon{ content:""; position: absolute; top:0; left:0; width: 48px; height: 48px; background:url(../assets/image/icoindex_wdmb.png) center no-repeat;}
.menubox .menu .icon.system{background:url(../assets/image/icoindex_xtgl.png) center no-repeat;}
.menubox .menu .icon.monitor{background:url(../assets/image/icoindex_xtjk.png) center no-repeat;}
.menubox .menu .icon.tool{background:url(../assets/image/icoindex_xtgj.png) center no-repeat;}
.menubox .menu .icon.excel{background:url(../assets/image/icoindex_bbgl.png) center no-repeat;}
.menubox .menu .icon.search{background:url(../assets/image/icoindex_zxcx.png) center no-repeat;}
.menubox .menu .icon.people{background:url(../assets/image/icoindex_wdmb.png) center no-repeat;}
.menubox .menu .icon.clipboard{background:url(../assets/image/iconindex_gdbb.png) center no-repeat;}
.menubox .menu .icon.download{background:url(../assets/image/iconindex_gxpt.png) center no-repeat;}
.menubox .menu .icon.swagger{background:url(../assets/image/iconindex_xtgj.png) center no-repeat;}
.menubox .menu .icon.job{background:url(../assets/image/ico_jgzx2.png) center no-repeat;}
.menubox .menu .icon.skill{background:url(../assets/image/ico_fxzx2.png) center no-repeat;}
.menubox .menu .icon.server{background:url(../assets/image/ico_wjzx.png) center no-repeat;}
.menubox .menu .icon.pdf{background:url(../assets/image/ico_wdzx2.png) center no-repeat;}
.menubox .menu .icon.user{background:url(../assets/image/ico_grzx.png) center no-repeat;}
.menubox .menu .icon.build{background:url(../assets/image/ico_fxzx1.png) center no-repeat;}
.menubox .menu .icon.documentation{background:url(../assets/image/ico_wdzx1.png) center no-repeat;}
.menubox .menu .icon.international{background:url(../assets/image/ico_map.png) center no-repeat;}
.menubox .menu p{ margin:0;line-height: 24px; padding:10px 0; font-size: 14px;}
.menubox .menu p:hover{ color:#408ec8}
.menubox .menu p span{cursor: pointer;}
.menubox .menu p.more{position: absolute; bottom:0}
.menubox .menu p.more span{color:#3d87c4;}
.menubox .menu .mask{ z-index: 8; position: fixed; top:0; left:0; width: 100%; height:100%;}
.menubox .menu .allmenu{ z-index: 9; position: absolute; top:-20px; left:38px; padding:20px 30px; background-color: #fff; border-radius: 5px; box-shadow: 0 0 10px #999; }
.menubox .menu:last-child .allmenu{ top:-20px; left:auto; right:0; }
.menubox .menu .allmenu .title{line-height: 48px; font-size: 20px; font-weight: normal; text-align: left; margin:0; }
.menubox .menu .allmenu .con{width: 250px; }
.menubox .menu .allmenu .con p{ float: left; margin:0 20px 0 0; text-align: center; }

.insfoot{height: 50px; padding:10px 0; text-align: center; font-size: 12px; line-height: 30px; border-top:#dbdbdb solid 1px; }
.insfoot .foot{width: 1200px; margin:0 auto;}
.insfoot .foot span{display: inline-block; margin:0 10px;}
.insfoot .foot span.ga{padding-left: 26px; background:url(../assets/image/beianbgs.png) left center no-repeat;}